@import "public.less";
@import "button.less";

.topSearch{
//  position: absolute;
    position: relative;
    width: 100%;
    height: 88px/2;
    z-index: 999;
    .mui-row{
        border-bottom: 1px solid #EBEBEB;
        position: relative;
        z-index: 10;
        background: #FFF;
    }
    .type{
        text-align: center;
        .fontSize(28px);
        height: 88px/2;
        line-height: 88px/2;
        -webkit-transition: all .5s linear; 
                transition: all .5s linear;
         color: @cfont2;
        span{
            padding-right: 14px;
            background: url(../icon/later.png) no-repeat right center;
            background-size: 7px 4px;
        }
        
        &.run{
            color: @red;
            span{
                 background: url(../icon/later-active.png) no-repeat right center;
                background-size: 7px 4px;
            }
        }
        
    }
    .select-list{
        position: absolute;
        width: 100%;
        left: 0;
        z-index: 1;
        -webkit-transition: all .2s linear; 
                transition: all .2s linear;
        opacity: 0;
        &.run{
            top: 45px !important;
            opacity: 1;
        }
        .mui-table-view-cell{
            padding: 15px;
            font-size: 36px/2;
            color: @cfont;
        }
        .mui-scroll-wrapper{
                padding-bottom: 50px;
                background: #FFF;
            }
            .mui-table-view:after{
                background-color: transparent;
            }
        .select-btn{
            height: 50px;
            line-height: 50px;
            text-align: center;
            position: absolute;
            bottom: 0px;
            width: 100%;
            left: 0;
            .mui-row{
                border-bottom: 0 none;
            }
            .mui-col-sm-9{
                background: @red;
                color: @white;
                font-size: 38px/2;
            }
            .mui-col-xs-3{
                background: #FFF;
                font-size: 28px/2;
                color: @cfont2;
                position: relative;
                &:after{
                    content: "" ;
                    height: 1px;
                    width: 100%;
                    position: absolute;
                    top: 0px;
                    left: 0px;
                    background: #ebebeb;
                }
            }
        }
    }
}


#refreshContainer{
    top: 45px;
}
.mectslist{
    .mui-table-view:before{
         background: transparent;
     }
     .label-icon{
         width: 30px/2;
     }
     .mui-table-view-cell{
         padding:13px 12px;
     }
     .mui-table-view-cell:after{
         background-color: #EBEBEB;
     }
     .score{
         margin-top: 0;
     }
     .mui-media-body{
         color: @cfont;
         font-size: 34px/2;
         div{
             .ell();
         }
         .mui-ellipsis{
             font-size: 28px/2;
             color: @cfont2;
             span{
                 margin-right: 5px;
             }
         }
     }
     .mui-media-object{
         line-height: 42px;
        max-width: 200px;
        height: 130px/2;
     }
}
 .list-item-box{
     margin:10px 14px;
     
     .item{
         position: relative;
         margin-bottom: 35.5px;
         img{
             width: 100%;
         }
         .collect{
             position: absolute;
             right: 0px;
             top: 0px;
             .wh2x(92px,82px);
             background: url("../icon/collect1_active.png") no-repeat center center;
             background-size: 46px/2 auto;
             &.active{
                  background: url("../icon/collect1.png") no-repeat center center;
                   background-size: 46px/2 auto;
             }
         }
         .item-name{
             padding:0 5px;
             margin-top: 14px;
             .name{
                 .fontSize(36.51px);
                 color: @cfont;
                 .ell();
             }
             .mui-pull-right{
                 color: @red;
                 .fontSize(36.51px);
                 
                 &.twoName{
                     font-size: 30px/2;
                     color: @cfont;
                 }
                 
             }
             
         }
         &.actor{
             .item-name{
                 border:1px solid #C4C4C4;
                 border-top: 0 none;
                 margin-top: 0px;
             }
             .actor-name{
                 padding:12.5px 0px;
                 .fontSize(36.51px);
                 color: @cfont;
                 .mui-pull-right{
                     .fontSize(30px);
                     color: @cfont;
                 }
             }
             .actor-fen{
                 padding:15px 0;
                 position:relative;
                 .mui-pull-right{
                     span{
                         display: inline-block;
                         padding:3px 6px;
                         border:1px solid @cfont2;
                         border-radius: 2px;
                         color: @cfont2;
                         .fontSize(30px);
                     }
                 }
                 &:after{
                     content: " ";
                     position: absolute;
                     top: 0px;
                     left: 0px;
                     width: 100%;
                     height: 1px;
                     background: #EBEBEB;
                 }
             }
         }
         
     }
 }
 .mark{
     position: fixed;
     width: 100%;
     height: 100%;
     background: rgba(0,0,0,.6);
     top: 0px;
     left: 0;
     z-index: 997;
     display: none;
 }
.nouder{
    padding: 40px 25px;
    padding-top: 0px;
    margin-top: 0px;
    .noUi-target{
        height: 2px;
        background: #d4cfcf;
    }
    .noUi-connect{
        height: 1px;
        background: @active;
    }
    .noUi-handle{
        .wh2x(56px,56px);
        border-radius: 50%;
        background: #FFF;
        top:-16px;
        &:after,&:before{
            content: "";
            display: none;
        }
    }
    .mui-clearfix{
        padding:10px 0;
    }
}



//
.mui-pull-top-tips {
                position: absolute;
                top: -20px;
                left: 50%;
                margin-left: -25px;
                width: 40px;
                height: 40px;
                border-radius: 100%;
                z-index: 10001;
            }
            .mui-bar~.mui-pull-top-tips {
                top: 24px;
            }
            .mui-pull-top-wrapper {
                width: 42px;
                height: 42px;
                display: block;
                text-align: center;
                background-color: #efeff4;
                border: 1px solid #ddd;
                border-radius: 25px;
                background-clip: padding-box;
                box-shadow: 0 4px 10px #bbb;
                overflow: hidden;
            }
            .mui-pull-top-tips.mui-transitioning {
                -webkit-transition-duration: 200ms;
                transition-duration: 200ms;
            }
            .mui-pull-top-tips .mui-pull-loading {
                /*-webkit-backface-visibility: hidden;
                -webkit-transition-duration: 400ms;
                transition-duration: 400ms;*/
                
                margin: 0;
            }
            .mui-pull-top-wrapper .mui-icon,
            .mui-pull-top-wrapper .mui-spinner {
                margin-top: 7px;
            }
            .mui-pull-top-wrapper .mui-icon.mui-reverse {
                /*-webkit-transform: rotate(180deg) translateZ(0);*/
            }
            .mui-pull-bottom-tips {
                text-align: center;
//              background-color: #efeff4;
                font-size: 15px;
                line-height: 40px;
                color: #777;
            }
            .mui-pull-top-canvas {
                overflow: hidden;
                background-color: #fafafa;
                border-radius: 40px;
                box-shadow: 0 4px 10px #bbb;
                width: 40px;
                height: 40px;
                margin: 0 auto;
            }
            .mui-pull-top-canvas canvas {
                width: 40px;
            }
            .mui-slider-indicator.mui-segmented-control {
                background-color: #efeff4;
            }